<template>
    <ul>
        <!-- <li>编号： {{ params.id }}</li> -->
        <!-- <li>名称： {{ params.title }}</li> -->
        <!-- <li>内容： {{ params.content }}</li> -->
        <li>编号： {{ id }}</li>
        <li>名称： {{ title }}</li>
        <li>内容： {{ content }}</li>
    </ul>
</template>


<script setup lang="ts" name = "Detail">
    // import { useRoute } from 'vue-router';
    // import { toRefs } from 'vue';
    // let route = useRoute();

    // // let {query} = toRefs(route);
    // let {params} = toRefs(route);
    //  配合路由的 props使用
    defineProps(['id', 'title', 'content']);

</script>


<style scoped>
ul {
    list-style: none;
}

li {
    margin: 10px 0;
}
.Detail {
    color: red;
    font-size: 20px;
    font-weight: bold;
    background-color: #ccc;
    text-align: center;
    padding: 10px;
    margin: 10px;
    border: 1px solid #000;
}

</style>
